<template>
	<div>
		<div>
			<el-button size="mini" @click="showUser=true">{{user_name}}</el-button>
		</div>
		<el-dialog
		        title="选择用户"
				:close-on-click-modal="false"
				:modal-append-to-body="false"
				:append-to-body="true"
		        :visible.sync="showUser"
		        width="1200px"
		>
			<div class="searchForm">
			    <div>
			        用户手机号： <el-input size="mini" v-model="search_form.phone" 
					placeholder="请输入用户手机号"  style="width:300px;"></el-input>
			    </div>
				<div>
				    <el-button type="primary" size="mini" @click="search">检索</el-button>
				    <el-button size="mini" @click="clearSearch">重置/检索</el-button>
				</div>
			</div>
			<br>
			<el-table  :data="list"
				 border  
				 style="width: 100%"
				>
				<el-table-column  label="操作"   align="center">
				     <template slot-scope="scope">
				        <div>
							<el-button @click="selectU(scope.row)" type="text">选择</el-button>
						</div>
				     </template>
				 </el-table-column>
				<el-table-column   align="center"    prop="phone"    label="手机号"></el-table-column>
				 <el-table-column  label="是否认证"   align="center">
				      <template slot-scope="scope">
				         <div>
							<el-tag v-if="scope.row.is_renzheng!=2" size="small" effect="dark" type="danger">否</el-tag>
							<el-tag v-if="scope.row.is_renzheng==2" size="small" effect="dark">是</el-tag>
				 		</div>
				      </template>
				  </el-table-column>
				  <el-table-column   align="center"    prop="add_time"   label="注册时间"></el-table-column>
				<el-table-column   align="center"    prop="name"    label="姓名"></el-table-column>
				<el-table-column   align="center"    prop="nick_name"    label="昵称"></el-table-column>
				<el-table-column   align="center"    prop="id_number"    label="身份证号"></el-table-column>
			   
			</el-table>
			<div class="page">
			    <el-pagination
			            background
			            @size-change="pageChange"
			            @current-change="handleCurrentChange"
			            :current-page="page"
			            :page-size="pageSize"
			            layout="total, sizes, prev, pager, next, jumper"
			            :total="page_totle">
			    </el-pagination>
			</div>
		    <br> <br>
		</el-dialog>
		
		
	</div>
</template>

<script>

	export default {
		data(){
			return {
				showUser:false,
				user_name:'选择用户',
				page:1,
				pageSize:10,
				search_form:{
					phone:''
				}
			}
		},
		components:{
			
		},
		mounted() {
			this.lodeList()
		},
		
		methods:{
			selectU(row){
				this.showUser = false
				this.user_name = row.name
				this.$emit('getUserInfo',row)
			},
			clearSearch(){
				this.search_form.phone = ''
				this.page = 1
				this.search()
			},
			lodeList(){
				let params = {
					search_form:this.search_form,
					page:this.page,
					pageSize:this.pageSize
				}
				this.$post('/user/lodeUserList',params,res=>{
					let data = res.data.data
					this.page_totle = data.count
					this.list = data.result
				})
			},
		}
	}
</script>

<style>
</style>